<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>Process</title>
<link rel="icon" type="image/png" href="images/favicon.ico" />
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
<!--[if lt IE 9]>
<script src="scripts/ie9.js">IE7_PNG_SUFFIX=".png";</script>
<![endif]-->
<link href='http://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="stylesheets/style.css"> 
<link rel="stylesheet" href="stylesheets/responsive.css"> 
<script src="scripts/jquery.min.js"></script> 
<script src="scripts/jquery.blackandwhite.min.js"></script>
<script src="scripts/js_func.js"></script>
<script>
$(function(){
    $('.bwWrapper').BlackAndWhite({
        hoverEffect : true,
        webworkerPath : false,
        responsive:true,
        invertHoverEffect:false
    });
});
</script>
</head>
<body>
<div class="wraper">
 <header class="header">
  <a class="logo" href="index.html">construct</a>
  <nav>
  <!-- top menu -->
   <ul>
    <li><a href="index.html">Home</a>
     <ul>
      <li><a href="index2.html">Home Version 2</a></li>
      <li><a href="index3.html">Home Version 3</a></li>
      <li><a href="index4.html">Home Version 4</a></li>
      <li><a href="index5.html">Home Version 5</a></li>
      <li><a href="index6.html">Home Version 6</a></li>
      <li><a href="index7.html">Home Version 7</a></li>
      <li><a href="index8.html">Home Version 8</a></li>
     </ul>
    </li>
    
    <li><a href="about.html">Pages</a>
     <ul>
      <li><a href="about.html">About Us</a></li>
      <li><a href="team.html">Team</a></li>
      <li><a href="services.html">Services</a></li>
      <li><a href="process.html">Process</a></li>
      <li><a href="testimonials.html">Testimonials</a></li>
      <li><a href="contact_us.html">Contact Us</a></li>
      <li><a href="pricing.html">Pricing</a></li>
      <li><a href="faq.html">FAQ</a></li>
      <li><a href="left_nav.html">Left Nav</a></li>
      <li><a href="left_sidebar.html">Left Sidebar</a></li>
      <li><a href="right_nav.html">Right Nav</a></li>
      <li><a href="right_sidebar.html">Right Sidebar</a></li>
      <li><a href="full_width.html">Full Width</a></li>
     </ul>
    </li>
    <li><a href="short_text.html">Portfolio</a>
     <ul>
      <li><a href="short_text.html">Short Text Layout</a>
       <ul>
        <li><a href="short_text.html">1 Column</a></li>
        <li><a href="short_text2.html">2 Column</a></li>
        <li><a href="short_text3.html">3 Column</a></li>
        <li><a href="short_text4.html">4 Column</a></li>
       </ul>
      </li>
      <li><a href="long_text.html">Long Text Layout</a>
       <ul>
        <li><a href="long_text_wide.html">1 Column Wide</a></li>
        <li><a href="long_text.html">1 Column</a></li>
        <li><a href="long_text2.html">2 Column</a></li>
        <li><a href="long_text3.html">3 Column</a></li>
        <li><a href="long_text4.html">4 Column</a></li>
       </ul>
      </li>
      <li><a href="filtered.html">Filtered Layout</a>
       <ul>
        <li><a href="filtered.html">1 Column</a></li>
        <li><a href="filtered2.html">2 Column</a></li>
        <li><a href="filtered3.html">3 Column</a></li>
        <li><a href="filtered4.html">4 Column</a></li>
       </ul>
      </li>
      <li><a href="right_sidebar.html">Right Sidebar</a>
       <ul>
        <li><a href="right_sidebar.html">1 Column</a></li>
        <li><a href="right_sidebar2.html">2 Column</a></li>
        <li><a href="right_sidebar3.html">3 Column</a></li>
       </ul>
      </li>
      <li><a href="left_sidebar.html">Left Sidebar</a>
       <ul>
        <li><a href="left_sidebar.html">1 Column</a></li>
        <li><a href="left_sidebar2.html">2 Column</a></li>
        <li><a href="left_sidebar3.html">3 Column</a></li>
       </ul>
      </li>
      <li><a href="gallery.html">Gallery Style</a>
       <ul>
        <li><a href="gallery.html">1 Column</a></li>
        <li><a href="gallery2.html">2 Column</a></li>
        <li><a href="gallery3.html">3 Column</a></li>
        <li><a href="gallery4.html">4 Column</a></li>
       </ul>
      </li>
      <li><a href="single_full.html">Portfolio Single Post</a>
       <ul>
        <li><a href="single_full.html">Full Width</a></li>
        <li><a href="single_right.html">Right Sidebar</a></li>
        <li><a href="single_left.html">Left Sidebar</a></li>
       </ul>
      </li>
     </ul>    
    </li>
    <li><a href="blog_post.html">Blog</a>
     <ul>
      <li><a href="blog_full_width.html">Full Width</a></li>
      <li><a href="blog_large.html">Large Image No Sidebar</a></li>
      <li><a href="blog_large_sidebar.html">Large Image With Sidebar</a></li>
      <li><a href="blog_medium_sidebar.html">Medium Image Right Sidebar</a></li>
     </ul>
    </li>
    <li><a href="shortcodes_typography.html">Shortcodes</a>
     <ul>
      <li><a href="shortcodes_typography.html">Typography</a></li>
      <li><a href="shortcodes_buttons_icons.html">Buttons</a></li>
      <li><a href="shortcodes_google_maps.html">Maps</a></li>
      <li><a href="shortcodes_content_sliders.html">Sliders</a></li>
      <li><a href="shortcodes_videos.html">Videos</a></li>
      <li><a href="shortcodes_pricing_tables.html">Tables</a></li>
      <li><a href="shortcodes_alerts_boxes.html">Boxes</a></li>
      <li><a href="shortcodes_accordions_tabs_toggles.html">Tabs</a></li>
     </ul>
    </li>
   </ul>
  <!-- /top menu -->
  </nav>
 </header>
</div> 

<div class="content_block">
 <!-- top_title -->
 <div class="top_title">
  <div class="wraper">
   <h2>Our Work Process<span>We like to do things the right way. Check out our proven process below!</span></h2>
   <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Pages</a></li>
    <li>Process</li>
   </ul>
  </div>
 </div>
 <!-- /top_title -->
 <div class="wraper">
  <!-- process -->
  <div class="process">
   <h4>Our Process Option #1</h4>
   <ul>
    <li>
     <h3><span>Step 1</span> Resaearch</h3>
     <p>Lid est laborum et dolorum fugaste. Etras harum quidem rerum facilis est etras expedita distinctio. Namsir uns libero uns tempo re, cum soluta nobis est eligendi optio cumque nihil impit qd amets untra dolor amet sadipet.</p>
    </li>
    <li>
     <h3><span>Step 2</span> Design</h3>
     <p>Lid est laborum et dolorum fugaste. Etras harum quidem rerum facilis est etras expedita distinctio. Namsir uns libero uns tempo re, cum soluta nobis est eligendi optio cumque nihil impit qd amets untra dolor amet sadipet.</p>
    </li>
    <li>
     <h3><span>Step 3</span> Develop</h3>
     <p>Lid est laborum et dolorum fugaste. Etras harum quidem rerum facilis est etras expedita distinctio. Namsir uns libero uns tempo re, cum soluta nobis est eligendi optio cumque nihil impit qd amets untra dolor amet sadipet.</p>
    </li>
    <li>
     <h3><span>Step 4</span> Deliver</h3>
     <p>Lid est laborum et dolorum fugaste. Etras harum quidem rerum facilis est etras expedita distinctio. Namsir uns libero uns tempo re, cum soluta nobis est eligendi optio cumque nihil impit qd amets untra dolor amet sadipet.</p>
    </li>
   </ul>
  </div>
  <!-- /process --> 
  <!-- process option2 -->
  <div class="process2">
   <h4>Our Process Option #2</h4>
	<div id="tabs" class="c_after">
     <ul class="tab_select">
      <li><span>Step 1</span><a href="#tab-1">Research and Plan</a></li>
      <li><span>Step 2</span><a href="#tab-2">Storyboard and Design</a></li>
      <li><span>Step 3</span><a href="#tab-3">Project Development</a></li>
      <li><span>Step 4</span><a href="#tab-4">Client Showing</a></li>
      <li><span>Step 5</span><a href="#tab-5">Feedback Revisions</a></li>
      <li><span>Step 6</span><a href="#tab-6">Client Approval</a></li>
      <li><span>Step 7</span><a href="#tab-7">Project Launch</a></li>
     </ul>
     <div id="tab-1">
      <h3>Lorem Ipsum Dolores Amet Un</h3>
      <h5>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.</h5>
      <p class="bwWrapper"><img src="images/services_process/services_1.png" width="298" height="193" alt="" /></p>
      <p>Lid est laborum et dolorum fugaerts. Etras harum quidem rerum facilis est etras expedita disnictio. Namsirs  libero uns tempo re, cum soluta nobis est eligendi optio cumque nihil ims duod amets untra dolor amet sad ipet. Fugiat dapibus, tellus ac cursus commodo, mauesris condime ntum nibh, ut fermes ntum mas justo sitts amet risus. Cras mattis cosi sectetut amet fermens tum aecer nas faucib  Sed ut perspiciatis unde omnis iste tus error siters voluptatem accusantium dolorem que laudantium, totam remteripaperiam, eaque ipsa quae  illos inventore veritatis etra quasi arch itecto beatae vitae dicta sunt explicabo. Nemo enim ipsam volu ptat equia voluptas sit aspernatur aut odit aut fugit.</p>
      <ul>
       <li>Cras rutrum leo at odio volutpat id blandit fugiats ipsum ornare.</li>
       <li>Donec fermentum porttitor nunc, sit amet gravida est porttitor vel.</li>
      </ul>
      <p><a class="learn_more btn_m" href="#">Learn More</a></p>
     </div>
     <div id="tab-2">
      <h3>Storyboard and Design</h3>
      <h5>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.</h5>
      <p class="bwWrapper"><img src="images/services_process/services_2.png" width="298" height="193" alt="" /></p>
      <p>Lid est laborum et dolorum fugaerts. Etras harum quidem rerum facilis est etras expedita disnictio. Namsirs  libero uns tempo re, cum soluta nobis est eligendi optio cumque nihil ims duod amets untra dolor amet sad ipet. Fugiat dapibus, tellus ac cursus commodo, mauesris condime ntum nibh, ut fermes ntum mas justo sitts amet risus. Cras mattis cosi sectetut amet fermens tum aecer nas faucib  Sed ut perspiciatis unde omnis iste tus error siters voluptatem accusantium dolorem que laudantium, totam remteripaperiam, eaque ipsa quae  illos inventore veritatis etra quasi arch itecto beatae vitae dicta sunt explicabo. Nemo enim ipsam volu ptat equia voluptas sit aspernatur aut odit aut fugit.</p>
      <ul>
       <li>Cras rutrum leo at odio volutpat id blandit fugiats ipsum ornare.</li>
       <li>Donec fermentum porttitor nunc, sit amet gravida est porttitor vel.</li>
      </ul>
      <p><a class="learn_more btn_m" href="#">Learn More</a></p>
     </div>
     <div id="tab-3">
      <h3>Project Development</h3>
      <h5>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.</h5>
      <p class="bwWrapper"><img src="images/services_process/services_3.png" width="298" height="193" alt="" /></p>
      <p>Lid est laborum et dolorum fugaerts. Etras harum quidem rerum facilis est etras expedita disnictio. Namsirs  libero uns tempo re, cum soluta nobis est eligendi optio cumque nihil ims duod amets untra dolor amet sad ipet. Fugiat dapibus, tellus ac cursus commodo, mauesris condime ntum nibh, ut fermes ntum mas justo sitts amet risus. Cras mattis cosi sectetut amet fermens tum aecer nas faucib  Sed ut perspiciatis unde omnis iste tus error siters voluptatem accusantium dolorem que laudantium, totam remteripaperiam, eaque ipsa quae  illos inventore veritatis etra quasi arch itecto beatae vitae dicta sunt explicabo. Nemo enim ipsam volu ptat equia voluptas sit aspernatur aut odit aut fugit.</p>
      <ul>
       <li>Cras rutrum leo at odio volutpat id blandit fugiats ipsum ornare.</li>
       <li>Donec fermentum porttitor nunc, sit amet gravida est porttitor vel.</li>
      </ul>
      <p><a class="learn_more btn_m" href="#">Learn More</a></p>
     </div>
     <div id="tab-4">
      <h3>Client Showing</h3>
      <h5>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.</h5>
      <p class="bwWrapper"><img src="images/services_process/services_4.png" width="298" height="193" alt="" /></p>
      <p>Lid est laborum et dolorum fugaerts. Etras harum quidem rerum facilis est etras expedita disnictio. Namsirs  libero uns tempo re, cum soluta nobis est eligendi optio cumque nihil ims duod amets untra dolor amet sad ipet. Fugiat dapibus, tellus ac cursus commodo, mauesris condime ntum nibh, ut fermes ntum mas justo sitts amet risus. Cras mattis cosi sectetut amet fermens tum aecer nas faucib  Sed ut perspiciatis unde omnis iste tus error siters voluptatem accusantium dolorem que laudantium, totam remteripaperiam, eaque ipsa quae  illos inventore veritatis etra quasi arch itecto beatae vitae dicta sunt explicabo. Nemo enim ipsam volu ptat equia voluptas sit aspernatur aut odit aut fugit.</p>
      <ul>
       <li>Cras rutrum leo at odio volutpat id blandit fugiats ipsum ornare.</li>
       <li>Donec fermentum porttitor nunc, sit amet gravida est porttitor vel.</li>
      </ul>
      <p><a class="learn_more btn_m" href="#">Learn More</a></p>
     </div>
     <div id="tab-5">
      <h3>Feedback Revisions</h3>
      <h5>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.</h5>
      <p class="bwWrapper"><img src="images/services_process/services_5.png" width="298" height="193" alt="" /></p>
      <p>Lid est laborum et dolorum fugaerts. Etras harum quidem rerum facilis est etras expedita disnictio. Namsirs  libero uns tempo re, cum soluta nobis est eligendi optio cumque nihil ims duod amets untra dolor amet sad ipet. Fugiat dapibus, tellus ac cursus commodo, mauesris condime ntum nibh, ut fermes ntum mas justo sitts amet risus. Cras mattis cosi sectetut amet fermens tum aecer nas faucib  Sed ut perspiciatis unde omnis iste tus error siters voluptatem accusantium dolorem que laudantium, totam remteripaperiam, eaque ipsa quae  illos inventore veritatis etra quasi arch itecto beatae vitae dicta sunt explicabo. Nemo enim ipsam volu ptat equia voluptas sit aspernatur aut odit aut fugit.</p>
      <ul>
       <li>Cras rutrum leo at odio volutpat id blandit fugiats ipsum ornare.</li>
       <li>Donec fermentum porttitor nunc, sit amet gravida est porttitor vel.</li>
      </ul>
      <p><a class="learn_more btn_m" href="#">Learn More</a></p>
     </div>
     <div id="tab-6">
      <h3>Client Approval</h3>
      <h5>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.</h5>
      <p class="bwWrapper"><img src="images/services_process/services_6.png" width="298" height="193" alt="" /></p>
      <p>Lid est laborum et dolorum fugaerts. Etras harum quidem rerum facilis est etras expedita disnictio. Namsirs  libero uns tempo re, cum soluta nobis est eligendi optio cumque nihil ims duod amets untra dolor amet sad ipet. Fugiat dapibus, tellus ac cursus commodo, mauesris condime ntum nibh, ut fermes ntum mas justo sitts amet risus. Cras mattis cosi sectetut amet fermens tum aecer nas faucib  Sed ut perspiciatis unde omnis iste tus error siters voluptatem accusantium dolorem que laudantium, totam remteripaperiam, eaque ipsa quae  illos inventore veritatis etra quasi arch itecto beatae vitae dicta sunt explicabo. Nemo enim ipsam volu ptat equia voluptas sit aspernatur aut odit aut fugit.</p>
      <ul>
       <li>Cras rutrum leo at odio volutpat id blandit fugiats ipsum ornare.</li>
       <li>Donec fermentum porttitor nunc, sit amet gravida est porttitor vel.</li>
      </ul>
      <p><a class="learn_more btn_m" href="#">Learn More</a></p>
     </div>
     <div id="tab-7">
      <h3>Project Launch</h3>
      <h5>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.</h5>
      <p class="bwWrapper"><img src="images/services_process/services_7.png" width="298" height="193" alt="" /></p>
      <p>Lid est laborum et dolorum fugaerts. Etras harum quidem rerum facilis est etras expedita disnictio. Namsirs  libero uns tempo re, cum soluta nobis est eligendi optio cumque nihil ims duod amets untra dolor amet sad ipet. Fugiat dapibus, tellus ac cursus commodo, mauesris condime ntum nibh, ut fermes ntum mas justo sitts amet risus. Cras mattis cosi sectetut amet fermens tum aecer nas faucib  Sed ut perspiciatis unde omnis iste tus error siters voluptatem accusantium dolorem que laudantium, totam remteripaperiam, eaque ipsa quae  illos inventore veritatis etra quasi arch itecto beatae vitae dicta sunt explicabo. Nemo enim ipsam volu ptat equia voluptas sit aspernatur aut odit aut fugit.</p>
      <ul>
       <li>Cras rutrum leo at odio volutpat id blandit fugiats ipsum ornare.</li>
       <li>Donec fermentum porttitor nunc, sit amet gravida est porttitor vel.</li>
      </ul>
      <p><a class="learn_more btn_m" href="#">Learn More</a></p>
     </div>
    </div>
  </div>
  <!-- /process option2 -->
  <!-- process option3 -->
  <div class="process3">
   <h4>Our Process Option #3</h4>
   <ul>
    <li>
      <img src="images/1.png" width="213" height="211" alt="" />
      <div class="desc">
       <h3>Research and Plan</h3>
       <h5>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.</h5>
       <p>Fugiat dapibus, tellus ac cursus commodo, mauesris condime ntum nibh, ut fermentum mas justo sitters amet risus. Cras mattis cosi sectetut amet fermens tum aecenas faucib sadips amets itecto beatae vitae dicta sunt expllicitis dolores ipsums. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque sits laudan tium, totam rem apster eriam, eaque ipsa quae ab illo inventore veritatis et quasi archerste itecto beatae vitae dicta sunt explicabo. Nemo enimse ipsam voluptatem quia voluptas sit aspe rnatur aut odit tersiaut fugit, sed quia consequuntur magni dolores eos qui ratione volupt atem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem.</p>
      </div>
    </li>
    <li>
      <img src="images/2.png" width="213" height="211" alt="" />
      <div class="desc">
       <h3>Storyboard and Design</h3>
       <h5>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.</h5>
       <p>Fugiat dapibus, tellus ac cursus commodo, mauesris condime ntum nibh, ut fermentum mas justo sitters amet risus. Cras mattis cosi sectetut amet fermens tum aecenas faucib sadips amets itecto beatae vitae dicta sunt expllicitis dolores ipsums. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque sits laudan tium, totam rem apster eriam, eaque ipsa quae ab illo inventore veritatis et quasi archerste itecto beatae vitae dicta sunt explicabo. Nemo enimse ipsam voluptatem quia voluptas sit aspe rnatur aut odit tersiaut fugit, sed quia consequuntur magni dolores eos qui ratione volupt atem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem.</p>
      </div>
    </li>
    <li>
      <img src="images/3.png" width="213" height="211" alt="" />
      <div class="desc">
       <h3>Project Development</h3>
       <h5>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.</h5>
       <p>Fugiat dapibus, tellus ac cursus commodo, mauesris condime ntum nibh, ut fermentum mas justo sitters amet risus. Cras mattis cosi sectetut amet fermens tum aecenas faucib sadips amets itecto beatae vitae dicta sunt expllicitis dolores ipsums. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque sits laudan tium, totam rem apster eriam, eaque ipsa quae ab illo inventore veritatis et quasi archerste itecto beatae vitae dicta sunt explicabo. Nemo enimse ipsam voluptatem quia voluptas sit aspe rnatur aut odit tersiaut fugit, sed quia consequuntur magni dolores eos qui ratione volupt atem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem.</p>
      </div>
    </li>
    <li>
      <img src="images/4.png" width="213" height="211" alt="" />
      <div class="desc">
       <h3>Project Delivered</h3>
       <h5>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.</h5>
       <p>Fugiat dapibus, tellus ac cursus commodo, mauesris condime ntum nibh, ut fermentum mas justo sitters amet risus. Cras mattis cosi sectetut amet fermens tum aecenas faucib sadips amets itecto beatae vitae dicta sunt expllicitis dolores ipsums. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque sits laudan tium, totam rem apster eriam, eaque ipsa quae ab illo inventore veritatis et quasi archerste itecto beatae vitae dicta sunt explicabo. Nemo enimse ipsam voluptatem quia voluptas sit aspe rnatur aut odit tersiaut fugit, sed quia consequuntur magni dolores eos qui ratione volupt atem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem.</p>
      </div>
    </li>
   </ul>
  </div>
  <!-- /process option3 -->
  
 </div>
</div>

<!-- footer -->
<!-- social block -->
<div class="social_block">
 <div class="wraper">
  <p>Stay connected with us in your favorite flavor!</p>
  <ul>
   <li class="facebook"><a href="#">Facebook</a></li>
   <li class="twitter"><a href="#">Twitter</a></li>
   <li class="linkedin"><a href="#">LinkedIn</a></li>
   <li class="rss"><a href="#">RSS</a></li>
   <li class="dribbble"><a href="#">Dribbble</a></li>
   <li class="google"><a href="#">Google+</a></li>
  </ul>
 </div>
</div>
<!-- /social block -->

<div class="footer">
 <footer>
  <!-- bottom about -->
  <div class="bottom_about">
   <p><img src="images/logo.png" alt="" /></p>
   <p>At vero eos et accusaus et iusto unir un dignissimos ducimus quirds siter ters pi blranditiis praesentium amets voluptatum un deleniti atque corrupti quosdirs dolores etra quasir moltias unstw excepturi sinte amets occaecatires.</p>
  </div>
  <!-- /bottom about -->
  <!-- recent tweets -->
  <div class="recent_tweets">
   <h3><span>Recent Tweets</span></h3>
   <ul>
    <li><a href="#">@laurakalbag</a> I will be very soon. Ase result reco endation <a href="#">31 minutes ago</a></li>
    <li><a href="#">@laurakalbag</a> you got chocolates!? That's i I'm signing up. <a href="#">37 minutes ago</a></li>
   </ul>
  </div>
  <!-- /recent tweets -->
  <!-- recent posts -->
  <div class="recent_posts">
   <h3><span>Recent Posts</span></h3>
   <ul>
    <li><a href="#">Lorem ipsum dolo amet consecect</a></li>
    <li><a href="#">Sed laoreet neque nonte mauris </a></li>
    <li><a href="#">Metus lacus, porta vestibulum</a></li>
    <li><a href="#">Morbi ac magna est ornare eliticits</a></li>
    <li><a href="#">Voluptas sadips nemis un etras</a></li>
   </ul>
  </div>
  <!-- /recent posts -->
  <!-- subscribe block -->
  <div class="subscribe_block">
   <h3><span>Stay Connected</span></h3>
   <form method="post" action="#">
    <p><input type="text" id="name" value="NAME ..." /></p>
    <p><input type="text" id="email" value="EMAIL ..." /></p>
    <p><input type="submit" value="Subscribe" /></p>
   </form>
  </div>
  <!-- /subscribe block -->
 </footer>
</div>

<!-- copyright -->
<div class="copyright">
 <div class="wraper">
  <p><span>Copyright 2012 Construct</span>All Rights Reserved<a href="#">RSS</a><a href="#">Comments</a></p>
  <a class="top" href="#">Back to the top</a>
 </div>
</div>
<!-- /copyright -->
<!-- /footer -->
</body>
</html> 
